<template>
    <div>
        <p class="content-list-name" 
            v-for="classifyTitle in list" 
            :key="classifyTitle._system_record_entry_id" 
            @click="addStyle(classifyTitle.maitKey,classifyTitle.miniWallkey)"
            :class="{active:classifyTitle.miniWallkey==fcid}"
        >{{classifyTitle.title}}</p>
    </div>
</template>
<script>
export default {
    methods: {
        addStyle(pid,fcid) {
            this.$store.dispatch("loadClassifyRightType",{pid,fcid});
            this.$store.dispatch("loadClassifyBottomType",{fcid,sort:"pop"});
            // this.$parent.sortTitle="pop";
            this.$emit("update:sort","pop");
        }
    },
    props: {
        list: {
            type: Array,
            default() {
                return new Array(16);
            }
        },
        fcid:{
            type:String,
            default(){
                return ""
            }
        }
    }
};
</script>
<style lang="less" scoped>
.content-list-name {
    text-align: center;
    margin: 0.6rem 0rem 0.8rem 0rem;
    font-weight: bold;
    box-sizing: border-box;
    border-left:0.1rem solid rgba(0, 0, 0, 0);
}
.active{
    border-left-color: @pink;
    color:@pink
}
</style>